<template>
	<view class="dt">
		<view class="title">基本信息：</view>
		<uni-list>
			<uni-list-item class="hasMsg" title="挂号医馆：" :rightText="list.guahao.ys.company_title"></uni-list-item>
			<uni-list-item class="hasMsg" title="挂号医生：" :rightText="list.guahao.ys.name"></uni-list-item>
			<uni-list-item class="hasMsg" title="挂号科室：" :rightText="list.guahao.ys.section_id_str"></uni-list-item>
			<uni-list-item class="hasMsg" title="挂号时间：" :rightText="list.guahao.time"></uni-list-item>
			<uni-list-item v-if="list.guahao.status == 1" class="hasStu" title="状态：" rightText="待看诊"></uni-list-item>
			<uni-list-item v-else-if="list.guahao.status == 2" class="hasStu" title="状态：" rightText="待支付"></uni-list-item>
			<uni-list-item v-else-if="list.guahao.status == 2" class="hasStu" title="状态：" rightText="待确定"></uni-list-item>
			<uni-list-item v-else class="hasStu" title="状态：" rightText="已结束"></uni-list-item>
			<uni-list-item v-if="list.order.price" class="hasMsg hasStu" title="订单金额：" :rightText="'￥'+list.order.price"></uni-list-item>
			<uni-list-item class="hasMsg" title="就诊人：" :rightText="list.guahao.user.name"></uni-list-item>
			<uni-list-item class="hasMsg" title="就诊人年龄：" :rightText="list.guahao.user.nianling"></uni-list-item>
			<uni-list-item class="hasMsg" title="主诉：" :rightText="list.guahao.zhusu"></uni-list-item>
			<!-- <uni-list-item class="hasNoData" title="实付金额：" rightText="￥78.82"></uni-list-item> -->
			<!-- <uni-list-item class="hasMsg" title="患者付款：" rightText="2021-09-01 15:52:27"></uni-list-item> -->
			<!-- <uni-list-item class="hasMsg" title="药房接单：" rightText="2021-09-01 15:52:27"></uni-list-item> -->
			<!-- <uni-list-item class="hasMsg" title="签收：" rightText="2021-09-01 15:52:27"></uni-list-item> -->
		</uni-list>
		<view class="title">患者信息：</view>
		<uni-list>
			<uni-list-item class="hasMsg hasStu" title="患者姓名：" :rightText="list.guahao.user.name + list.guahao.user.nianling"></uni-list-item>
			<uni-list-item class="hasMsg" title="患者性别：" v-if="list.guahao.user.sex == 1" rightText="男"></uni-list-item>
			<uni-list-item class="hasMsg" title="患者性别：" v-else rightText="女"></uni-list-item>
			<uni-list-item v-if="list.kaifang.zhenduan" class="hasMsg" title="中医诊断：" :rightText="list.kaifang.zhenduan"></uni-list-item>
		</uni-list>
		<view v-if="list.kflist != 0">
			<view class="title">开方信息：</view>
			<uni-list-item v-if="list.kflist.length == 0" class="hasMsg" title="药材：" rightText="订单支付后展示"></uni-list-item>
			<uni-list>
				<uni-list-item class="hasMsg" title="药材：">
					<template slot="footer">
						<view class="docSign">
							<text v-for="(i,k) in list.kflist" :key="k">{{i.title}};</text>
						</view>
					</template>
				</uni-list-item>
			</uni-list>
		</view>
		<view v-if="list.order != 0">
			<view class="title">处方信息：</view>
			<uni-list>
				<uni-list-item class="hasMsg" title="方剂类型：" :rightText="list.order.typestr"></uni-list-item>
				<uni-list-item class="hasMsg" title="剂型：" :rightText="list.order.typestr"></uni-list-item>
				<uni-list-item class="hasMsg" title="用法：" v-if="list.kaifang.yongfa == 0" rightText="内服"></uni-list-item>
				<uni-list-item class="hasMsg" title="用法：" v-else rightText="外用"></uni-list-item>
				<uni-list-item class="hasMsg" title="剂数：" :rightText="list.kaifang.jishu+'剂'"></uni-list-item>
				<uni-list-item class="hasMsg" title="每日：" :rightText="list.kaifang.meiri+'剂'"></uni-list-item>
				<uni-list-item class="hasMsg" title="一剂分几次：" :rightText="list.kaifang.jifen+'次'"></uni-list-item>
				<uni-list-item class="hasMsg" title="每次多少：" :rightText="list.kaifang.meici+'ml'"></uni-list-item>
				<!-- <uni-list-item class="hasMsg" title="取发药：" rightText="加急"></uni-list-item> -->
				<uni-list-item class="hasMsg" title="医嘱：" :rightText="list.kaifang.yizhu"></uni-list-item>
			</uni-list>
		</view>
		<view v-if="list.order.kuaidi_name">
			<view class="title">快递信息：</view>
			<uni-list>
				<uni-list-item class="hasMsg" title="快递公司：" rightText="顺丰快递"></uni-list-item>
				<uni-list-item v-if="list.order.kuaidi_num" class="hasMsg" title="快递单号：" :rightText="list.order.kuaidi_num"></uni-list-item>
				<uni-list-item class="hasMsg" title="收货人：" :rightText="list.order.kuaidi_name"></uni-list-item>
				<uni-list-item class="hasMsg" title="手机号码：" :rightText="list.order.kuaidi_phone"></uni-list-item>
				<uni-list-item class="hasMsg" title="收货地址：" :rightText="list.order.province_name+list.order.city_name+list.order.area_name+list.order.address"></uni-list-item>
				<view v-if="wlxx.length!=0">
					<uni-list-item class="hasMsg" title="物流信息：" rightText="">
						<template slot="footer">
							<view class="docSign2">
								<view class="text" v-for="(i,k) in wlxx" :key="k">{{i.time}}：{{i.context}}</view>
							</view>
						</template>
					</uni-list-item>
					<!-- <uni-list-item v-for="(item,index) in wlxx" class="hasMsg" :title="item.time" :rightText="item.context"></uni-list-item> -->
				</view>
			</uni-list>
		</view>
		<view style="height: 50upx;"></view>
		<view v-if="list.guahao.status == 2" class="btnStyle" @click="pay">立即支付</view>
		<view style="height: 50upx;"></view>
	</view>
</template>

<script>
	import {
		guahao_detail
	} from '../../request/api.js'
	export default {
		data() {
			return {
				id:'',
				list:{
					guahao:{
						oid:'',
						time:"",
						status:"",
						ys:{
							company_title:"",
							name:"",
							section_id_str:"",
						},
						user:{
							name:"",
							nianling:""
						}
					},
					order:{
						price:'',
						typestr:'',
						kuaidi_num:'',
						kuaidi_name:'',
						kuaidi_phone:'',
						province_name:'',
						city_name:'',
						area_name:'',
						address:'',
						kd_content:'',
					},
					kflist:[],
					kaifang:{
						zhenduan:'',
						yongfa:'',
						jishu:'',
						meiri:'',
						jifen:'',
						meici:'',
						yizhu:'',
					}
				},
				wlxx:[]
			}
		},
		onLoad(options) {
			this.$nextTick(() => {
				this.id = options.id
				guahao_detail({id:options.id}).then(res => {
					this.list = res.data
					if(this.list.order.kd_content){
						this.wlxx = JSON.parse(this.list.order.kd_content).data.data
					}
				})
			})
		},
		methods: {
			pay(){
				uni.navigateTo({
					url:'./pay?id='+this.list.guahao.oid
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.dt{
		padding:0 30upx;
		font-size: 30upx;
		line-height: 160%;
		
		.title{
			font-size: 32upx;
			font-weight: bold;
			margin-top: 30upx;
		}
		
		::v-deep .hasMsg{
			.uni-list-item__extra-text{
				color: #9F9F9F;
				flex: 1;
				width:470upx;
				text-align: right;
			}
			
		}
		::v-deep .hasNoData{
			.uni-list-item__extra-text{
				color: #F86C53;
			}
		}
		::v-deep .hasStu{
			.uni-list-item__extra-text{
				color: #0000FF;
			}
		}
		
		::v-deep .uni-list-item__content-title {
			font-size: 30upx;
			color: #000000;
			white-space: nowrap;
		}
		
		::v-deep .uni-icons {
			padding: 0;
		}
		
		::v-deep .uni-list-item__container {
			padding-left: 0;
			padding-right: 0;
		}
		::v-deep .uni-list-item__extra-text{
			color: #000000;
			font-size: 28upx;
		}
		::v-deep .uni-list--border-top{
			height: 0px;
		}
		.docSign{
			width:500upx;
			text-align: right;
			flex-shrink: 0;
			text-align: right;
			color: #0000FF;
		}
		.docSign2{
			text-align: justify;
			width: 500upx;
			
			.text{
				margin-bottom: 15upx;
				font-size: 28upx;
				color: #9F9F9F;
			}
		}
	}
	
</style>
